<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div class="container"><div>111</div>
        <div>222</div>
        <div>333</div></div>
   
    
    <script>
        // dom树：节点（换行、空格、制表符）元素 ---》元素节点
        // 元素：element； 节点：node  ; nodejs

        //一、节点或者元素之间的各种关系；

        // 子关系 ；
        var containerEle = document.querySelector(".container");
        // 1.获取子元素 父元素.children
        // var childrens = containerEle.children;
        // console.log(childrens);
        // // 2.获取子节点
        // var nodes = containerEle.childNodes;
        // console.log(nodes);

        // 3.获取第一个子元素firstElementChild
        // console.log( containerEle.firstElementChild);
        // 4.获取第一个子节点
        // console.log(containerEle.firstChild);

        // 5.获取最后一个子元素 
        // console.log(containerEle.lastElementChild);
        // 6.获取最后一个子节点
        // console.log(containerEle.lastChild);



    </script>
</body>
</html>